<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>

<!-- Content Header (Page header) -->
<section class="content-header">
	<h1>
		<spring:message code="admin.article.search" />
	</h1>
	<ol class="breadcrumb">
		<li><a href="goHomePage.html"><i class="fa fa-dashboard"></i> <spring:message code="admin.homepage.title" /></a></li>
		<li class="active"><spring:message code="admin.article.search" /></li>
	</ol>
</section>

<!-- Main content -->
<section class="content">
	<div class="row">
		<!-- left column -->
		<div class="col-md-12">
			<!-- general form elements -->
			<div class="box box-primary">
				<div class="box-header">
					<h3 class="box-title">
						<spring:message code="admin.article.search" />
					</h3>
				</div>
				<!-- /.box-header -->
				<!-- form start -->
				<form:form role="form" action="searchArticle.html" method="post" commandName="searchArticle">
					<div class="box-body">
						<div class="form-group">
							<label><spring:message code="admin.article.name" /></label>
							<form:input type="text" class="form-control" path="name" />
						</div>
						<div class="form-group">
							<label><spring:message code="admin.article.keyword" /></label>
							<form:input type="text" class="form-control" path="keyword" />
						</div>
						<div class="form-group">
							<label><spring:message code="admin.article.group" /></label>
							<form:select class="form-control" items="${articleGroups}" path="articelGroupId">
							</form:select>
						</div>
					</div>
					<!-- /.box-body -->
					<div class="box-footer">
						<button class="btn btn-success" type="submit">
							<spring:message code="admin.form.button.submit" />
						</button>
						<button class="btn btn-warning" type="reset">
							<spring:message code="admin.form.button.reset" />
						</button>
					</div>
				</form:form>
			</div>
			<!-- /.box -->
		</div>
		<!--/.col (right) -->
		<div class="col-xs-12">
			<div class="box">
				<div class="box-header">
					<h3 class="box-title">
						<spring:message code="admin.table.title" />
					</h3>
				</div>
				<!-- /.box-header -->
				<div class="box-body table-responsive">
					<div role="grid" class="dataTables_wrapper form-inline" id="main-table_wrapper">
						<table class="table table-bordered table-striped dataTable" id="main-table" aria-describedby="main-table_info">
							<thead>
								<tr role="row">
									<th class="sorting_asc" role="columnheader" tabindex="0" aria-controls="main-table" rowspan="1" colspan="1" style="width: 193px;" aria-sort="ascending"
										aria-label="Rendering engine: activate to sort column descending"><spring:message code="admin.article.name" /></th>
									<th class="sorting" role="columnheader" tabindex="0" aria-controls="main-table" rowspan="1" colspan="1" style="width: 163px;"
										aria-label="Engine version: activate to sort column ascending"><spring:message code="admin.article.keyword" /></th>
									<th class="sorting" role="columnheader" tabindex="0" aria-controls="main-table" rowspan="1" colspan="1" style="width: 163px;"
										aria-label="Engine version: activate to sort column ascending"><spring:message code="admin.article.group" /></th>
									<th class="sorting" role="columnheader" tabindex="0" aria-controls="main-table" rowspan="1" colspan="1" style="width: 163px;"
										aria-label="Engine version: activate to sort column ascending"><spring:message code="admin.table.column.option" /></th>
								</tr>
							</thead>

							<tfoot>
								<tr>
									<th rowspan="1" colspan="1"><spring:message code="admin.article.name" /></th>
									<th rowspan="1" colspan="1"><spring:message code="admin.article.keyword" /></th>
									<th rowspan="1" colspan="1"><spring:message code="admin.article.group" /></th>
									<th rowspan="1" colspan="1"><spring:message code="admin.table.column.option" /></th>
								</tr>
							</tfoot>
							<tbody>
								<c:forEach var="pg" items="${rs}">
									<tr>
										<td><c:out value='${pg.name }' /></td>
										<td><c:out value='${pg.keyword}' /></td>
										<td><c:forEach var="ag" items="${articleGroups}">
												<c:if test="${ag.key == pg.articelGroupId}">
													<c:out value="${ag.value }" />
												</c:if>
											</c:forEach></td>
										<td><a href="viewArticle.html?id=${pg.id }"> <i class="fa fa-search-plus"></i>
										</a>&nbsp;&nbsp; <a href="updateArticle.html?id=${pg.id }"> <i class="fa fa-edit (alias)"></i>
										</a>&nbsp;&nbsp; <a onclick="deleteRow('deleteArticle/'+${pg.id},this);" href="javascript:void(0);"> <i class="fa fa-trash-o"></i>
										</a></td>
									</tr>
								</c:forEach>
							</tbody>
						</table>
					</div>
				</div>
				<!-- /.box-body -->
			</div>
			<!-- /.box -->
		</div>
	</div>
	<!-- /.row -->
</section>
<!-- /.content -->
<!-- page script -->
<script type="text/javascript">
var table;
$(document).ready(function() {
	 table = $("#main-table").dataTable({
		 "oLanguage" : {
				"oAria" : {
					"sSortAscending" : '<spring:message javaScriptEscape="true" code="admin.table.page.sSortAscending" />',
					"sSortDescending" : '<spring:message javaScriptEscape="true" code="admin.table.page.sSortDescending" />'
				},
				"oPaginate" : {
					"sFirst" : '<spring:message javaScriptEscape="true" code="admin.table.page.sFirst" />',
					"sLast" : '<spring:message javaScriptEscape="true" code="admin.table.page.sLast" />',
					"sNext" : '<spring:message javaScriptEscape="true" code="admin.table.page.sNext" />',
					"sPrevious" : '<spring:message javaScriptEscape="true" code="admin.table.page.sPrevious" />'
				},
				"sEmptyTable": '<spring:message javaScriptEscape="true" code="admin.table.page.sEmptyTable" />',
				"sInfo": '<spring:message javaScriptEscape="true" code="admin.table.page.sInfo" />',
				"sInfoEmpty": '<spring:message javaScriptEscape="true" code="admin.table.page.sInfoEmpty" />',
				"sInfoFiltered": '<spring:message javaScriptEscape="true" code="admin.table.page.sInfoFiltered" />',
				"sLengthMenu": '<spring:message javaScriptEscape="true" code="admin.table.page.sLengthMenu" />',
				"sLoadingRecords": '<spring:message javaScriptEscape="true" code="admin.table.page.sLoadingRecords" />',
				"sZeroRecords": '<spring:message javaScriptEscape="true" code="admin.table.page.sZeroRecords" />',
				"sSearch": '<spring:message javaScriptEscape="true" code="admin.table.page.oLanguage.sSearch" />'
			}
	});
});
	

function deleteRow(url, p) {
	$.ajax({
		url : url+'.html',
		type : 'DELETE',
		dataType : 'text',
		contentType : "application/json; charset=utf-8",
		success : function(response) {
			console.log(response);
			if (!response) {
				$("#success-dialog").modal('show');
				var row = $(p).closest("tr").get(0);
				table.fnDeleteRow(table.fnGetPosition(row));
			} else {
				$("#error-dialog").modal('show');
			}
		},
		error : function() {
			$("#error-dialog").modal('show');
		}
	});
}
</script>